<template>
  <div>
    <div class="card">
      <el-row>
        <el-col :span="21" style="margin:0px 0px 10px 90px">
          <el-alert
          title="本页面的echarts图例都是动态的！！"
          type="success"
          effect="dark"
          close-text="知道了">
          </el-alert>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="10" style="margin-left:100px;">
          <circledata></circledata>
        </el-col>
        <el-col :span="9" style="margin-left: 50px ;">
          <piedata></piedata>
        </el-col>
      </el-row>
    </div>
    <el-row style="margin-top: 20px;">
      <el-col :span="10" style="margin-left:100px;">
        <stackdata></stackdata>
      </el-col>
      <el-col :span="10" style="margin-left:50px;">
        <mapdata></mapdata>
      </el-col>
    </el-row>

  </div>
</template>

<script>
import circledata from '@/components/echarts/circledata.vue'
import mapdata from '@/components/echarts/mapdata.vue'
import stackdata from '@/components/echarts/stackdata.vue'
import piedata from '@/components/echarts/piedata.vue'
export default {
    name:"home",
    components:{
      circledata,
      mapdata,
      stackdata,
      piedata
    },
    
}
</script>

<style>
.home{
  background-color: aquamarine;
}
/*.stacktitle.el-card ::v-deep .el-card__header {
  background-color: palegoldenrod;
}*/
.bannerimg{
  width: 100%;
  height: inherit;
}

</style>
